$def with (settings, printer)

<script type="text/javascript">
$$(document).ready(function() {
    $$( "#tabs" ).tabs();
    $$("#save-local").click(function() {
        $$.post( "/ajax", { 
            'func': "save_file",
            'filename': "/etc/redeem/local.cfg",
            'content': $$("#local-config").val()
        }).done(function( data ) {
            highlight(data.ok, "#local-config");
        });
    });

    $$("#save-printer").click(function() {
        $$.post( "/ajax", { 
            'func': "choose_printer",
            'filename': $$("#printer-config").val()
        }).done(function( data ) {
            $$("#printer-settings").html(data.new_config)
            highlight(data.ok, "#printer-settings");
            highlight(data.ok, "#printer-config");
        });
    });
    $$("#printer-config-visual").change(function() {
        $$.post( "/ajax", { 
            'func': "choose_printer",
            'filename': $$("#printer-config-visual").val()
        }).done(function( data ) {
            $$("#printer-config-image").attr("src", "/static/images/printers/"+data.image_name)
        });
    });
});

function highlight(ok, id){
    if(ok){
        $$(id).effect( "highlight", 
            {color:"green"}, 1000 );
    } else {
        $$(id).effect( "highlight", 
            {color:"red"}, 1000 );
    }
}
</script>



<h1>Configure your printer</h1>
<div id="tabs">
    <ul>
        <!--<li><a href="#tabs-1">Visual</a></li>-->
        <li><a href="#tabs-2">Text based</a></li>
    </ul>
    <!--<div id="tabs-1">
        Printer <select id="printer-config-visual" autocomplete="off">
            $for file in settings["printers"]["all"]:
                $if file == settings["printers"]["current"]["name"]:
                    <option value="$file" selected="1">$file</option>
                $else:
                    <option value="$file">$file</option>
        </select><br> 
        <img id="printer-config-image" src="/static/images/printers/$settings['printers']['current']['image_name']" style="height: 200px; display: block; margin-left: auto; margin-right: auto">
        <h2>[System]</h2>
        Replicape revision 
        <select>
            <option>A3</option>
            <option>A3A</option>
            <option>A4</option>
            <option>A4A</option>
        </select><br>
        Loglevel 
        <select>
            <option>Debug</option>
            <option>Info</option>
            <option>Warning</option>
            <option>Error</option>
        </select>
        <h2>[Geometry]</h2>
        <p>This part is related to the axis on your printer and speed etc. </p>
        <img src="/static/images/Geometry.jpg" style="width: 100%">
        <h2>[Steppers]</h2>
        <p>These are settings for your stepper motors</p>
        <img src="/static/images/5-steppers.jpg" style="width: 100%">
        <h2>[Cold-ends]</h2>
        <h2>[Heaters]</h2>
        <h2>[Endstops]</h2>
    </div>-->
    <div id="tabs-2">
        <p>There are tree cascading config files used to configure this printer. 
            At the bottom lies the default config file. 
            This has all the settigns for Redeem. Next is the printer config. This contains the 
            settings specific for the printer. Finally is the local config. This file you can change
            and override settings from the other two. </p>
        <h3>Local config</h3>
        <p>If your changes are not standard to the printer, place them here</p>
        <textarea id="local-config" style="width: 100%; height: 200px;">$settings["local"]</textarea>
        <button type="button" id="save-local">Save</button>
        <h3>Printer config</h3>
        <p>These are the settings that are standard for your printer</p>
        printer.cfg -> <select id="printer-config" autocomplete="off">
            $for file in settings["printers"]["all"]:
                $if file == settings["printers"]["current"]["name"]:
                    <option value="$file" selected="1">$file</option>
                $else:
                    <option value="$file">$file</option>
        </select> 
        <button type="button" id="save-printer">Save</button>
        <pre id="printer-settings">$settings["printer"]</pre>
        <h3>Default config</h3>
        <p>These are the catch-all settings. You can use this for reference as well.</p>
        <pre>$settings["default"]</pre>       
    </div>
</div>








